<template>
    <div>
      <div class="banner">
        <img :src="img" alt="数据加载失败">
        <p>
          <span>节目数量：{{program<10?0+program:program}}</span>
          <span>总投票：{{partake_vote<10?0+partake_vote:partake_vote}}</span>
        </p>
      </div>
      <!--<div class="vote-tit">-->
        <!--<p>{{title2}}</p>-->
        <!--<div class="vt-fot">-->
          <!--<p>-->
            <!--<span>参与人数:{{partake_num<10?0+partake_num:partake_num}}</span>-->
            <!--<span>总投票数:{{partake_vote<10?0+partake_vote:partake_vote}}</span>-->
          <!--</p>-->
          <!--<p>-->
            <!--<span>参赛人数:{{contestant<10?0+contestant:contestant}}</span>-->
            <!--<span>总投票数:{{contestant_vote<10?0+contestant_vote:contestant_vote}}</span>-->
          <!--</p>-->
          <!--<p>-->
            <!--<span>节目数量:{{program<10?0+program:program}}</span>-->
            <!--<span>总投票数:{{program_vote<10?0+program_vote:program_vote}}</span>-->
          <!--</p>-->
        <!--</div>-->
      <!--</div>-->

      <router-view></router-view>
    </div>
</template>

<script>
  import * as list from "../../../api/list.js";
    export default {
      name: "Vote",
      data(){
        return {
          img:'',
          title2:'',
          partake_num:'',
          partake_vote:'',
          contestant:'',
          contestant_vote:'',
          program:'',
          program_vote:''
        }
      },
      beforeMount(){
        let parmes3 = {active_id:this.$route.params.id3};
        //投票主图
        list.activeBanner(parmes3).then(res=>{
          console.log('投票主图',res)
          this.img = res.data.img[0]
        });
        //投票数量
        list.activePoll(parmes3).then(res=>{
          console.log('投票数量',res);
          this.partake_num = res.data.partake_num;
          this.partake_vote = res.data.partake_vote;
          this.contestant = res.data.contestant;
          this.contestant_vote = res.data.contestant_vote;
          this.program = res.data.program;
          this.program_vote = res.data.program_vote;
        });
      },
      mounted(){
        mui.back = function() {
          window.history.go(-1);
        }
      }
    }
</script>

<style scoped>
  .banner{
    position: relative;
    width: 100%;
    height: 420px;
    background: #dcdcdc;
  }
  .banner img{
    width: 100%;
    height: 100%;
  }
  .banner p{
    background: rgba(0,0,0,0.7);
    width: 100%;
    box-sizing: border-box;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 20px 30px;
    display: flex;
    justify-content: space-between;
  }
  .banner p span{
    font-size: 24px;
    color: #fff;
  }

  /*.vote-tit{*/
    /*padding: 20px 40px;*/
  /*}*/
 /*.vote-tit>p{*/
   /*font-size: 32px;*/
   /*font-weight: bold;*/
 /*}*/
  /*.vote-tit .vt-fot{*/
    /*margin: 20px 0;*/
    /*border: 1px solid #dcdcdc;*/
    /*padding: 20px;*/
  /*}*/
  /*.vote-tit .vt-fot p{*/
    /*display: flex;*/
    /*justify-content: space-between;*/
    /*padding-bottom: 20px;*/
  /*}*/
  /*.vote-tit .vt-fot p:last-child{*/
    /*padding-bottom: 0;*/
  /*}*/
  /*.vote-tit .vt-fot p span{*/
    /*font-size: 26px;*/
  /*}*/
  /*.vote-tit .vt-fot p span:nth-child(2){*/
    /*text-align: right;*/
  /*}*/



</style>
